export const basicComponents = [
    {
        type: 'BaseInput',
        name: '单行输入框',
        icon: 'icon-input',
        options: {
            label: '单行输入框',
            width: 200,
            height: 200,
            left: 0,
            top: 0,
            defaultValue: '',
            required: false,
            dataType: 'string',
            pattern: '',
            placeholder: ''
        }
    },
    {
        type: 'BaseTextarea',
        name: '多行输入框',
        icon: 'icon-diy-com-textarea',
        options: {
            label: '多行输入框',
            width: 200,
            height: 200,
            left: 0,
            top: 0,
            defaultValue: '',
            required: false,
            disabled: false,
            pattern: '',
            placeholder: ''
        }
    },
    {
        type: 'BaseRadio',
        name: '单选框组',
        icon: 'icon-radio-active',
        options: {
            label: '单选框组',
            width: 200,
            height: 200,
            left: 0,
            top: 0,
            inline: false,
            defaultValue: '',
            showLabel: false,
            options: [
                {
                    value: '选项1',
                    label: '选项1'
                },
                {
                    value: '选项2',
                    label: '选项2'
                },
                {
                    value: '选项3',
                    label: '选项3'
                }
            ],
            required: false,
            remote: false,
            remoteOptions: [],
            props: {
                value: 'value',
                label: 'label'
            },
            remoteFunc: ''
        }
    },
    {
        type: 'BaseCheckbox',
        name: '多选框组',
        icon: 'icon-check-box',
        options: {
            label: '多选框组',
            width: 200,
            height: 200,
            left: 0,
            top: 0,
            inline: false,
            defaultValue: [],
            showLabel: false,
            options: [
                {
                    value: '选项1'
                },
                {
                    value: '选项2'
                },
                {
                    value: '选项3'
                }
            ],
            required: false,
            remote: false,
            remoteOptions: [],
            props: {
                value: 'value',
                label: 'label'
            },
            remoteFunc: ''
        }
    },
    {
        type: 'BaseNumber',
        name: '计数器',
        icon: 'icon-number',
        options: {
            label: '计数器',
            width: 200,
            height: 200,
            left: 0,
            top: 0,
            required: false,
            defaultValue: 0,
            min: '',
            max: '',
            step: 1,
            disabled: false,
            controlsPosition: ''
        }
    },
    {
        type: 'BaseDateTime',
        name: '日期选择器',
        icon: 'icon-date',
        options: {
            label: '日期选择器',
            width: 200,
            height: 200,
            left: 0,
            top: 0,
            defaultValue: '',
            readonly: false,
            disabled: false,
            editable: true,
            clearable: true,
            placeholder: '',
            startPlaceholder: '',
            endPlaceholder: '',
            dateType: 'date',
            format: 'yyyy-MM-dd',
            timestamp: false,
            required: false
        }
    },
    {
        type: 'BaseRate',
        name: '评分',
        icon: 'icon-icon-test',
        options: {
            label: '评分',
            width: 200,
            height: 200,
            left: 0,
            top: 0,
            defaultValue: null,
            max: 5,
            disabled: false,
            allowHalf: false,
            required: false
        }
    },
    {
        type: 'BaseColor',
        name: '颜色选择器',
        icon: 'icon-color',
        options: {
            label: '颜色选择器',
            width: 200,
            height: 200,
            left: 0,
            top: 0,
            defaultValue: '',
            disabled: false,
            showAlpha: false,
            required: false
        }
    },
    {
        type: 'BaseSelect',
        name: '下拉框',
        icon: 'icon-select',
        options: {
            label: '下拉框',
            width: 200,
            height: 200,
            left: 0,
            top: 0,
            defaultValue: '',
            multiple: false,
            disabled: false,
            clearable: false,
            placeholder: '',
            required: false,
            showLabel: false,
            options: [
                {
                    value: '下拉框1'
                },
                {
                    value: '下拉框2'
                }, {
                    value: '下拉框3'
                }
            ],
            remote: false,
            filterable: false,
            remoteOptions: [],
            props: {
                value: 'value',
                label: 'label'
            },
            remoteFunc: ''
        }
    },
    {
        type: 'BaseSwitch',
        name: '开关',
        icon: 'icon-switch',
        options: {
            label: '开关',
            width: 50,
            height: 30,
            left: 0,
            top: 0,
            defaultValue: false,
            required: false,
            disabled: false
        }
    },
    {
        type: 'BaseSlider',
        name: '滑块',
        icon: 'icon-slider',
        options: {
            label: '滑块',
            width: 200,
            height: 200,
            left: 0,
            top: 0,
            defaultValue: 0,
            disabled: false,
            required: false,
            min: 0,
            max: 100,
            step: 1,
            showInput: false,
            range: false
        }
    },
    {
        type: 'BaseImg',
        name: '图片',
        icon: 'icon-tupian',
        options: {
            width: 200,
            height: 200,
            left: 0,
            top: 0,
            defaultValue: 'https://avatars2.githubusercontent.com/u/12621342?v=4',
            textAlign: 'center',
            backgroundColor: '#fff',
            borderRadius: '0px',
            linkType: 'inline',
            linkUrl: '',
            query: ''
        }
    },
    // 链接分为内链和外链（inline/outer）
    {
        type: 'BaseTitle',
        name: '标题',
        icon: 'icon-input',
        options: {
            width: 200,
            height: 40,
            left: 0,
            top: 0,
            backgroundColor: '#fff',
            defaultValue: '标题',
            defaultCName: '标题',
            inline: false,
            textAlign: 'center',
            fontColor: '#000',
            fontSize: '12px',
            fontWeight: 600,
            marginLeft: '0px',
            marginRight: '0px',
            marginTop: '0px',
            marginBottom: '0px',
            titleHeight: '',
            lineHeight: '40px',
            linkType: 'inline',
            linkUrl: '',
            query: ''
        }
    },
    {
        type: 'BaseTag',
        name: '标签',
        icon: 'icon-input',
        options: {
            width: 100,
            height: 30,
            left: 0,
            top: 0,
            defaultValue: '标签',
            defaultCName: '标签',
            type: 'success',
            hit: false,
            tagColor: '',
            size: 'small',
            marginLeft: '0px',
            marginRight: '0px',
            marginTop: '0px',
            marginBottom: '0px',
            linkType: 'inline',
            linkUrl: '',
            query: ''
        }
    },
    {
        type: 'BaseCell',
        name: '单元格',
        icon: 'icon-input',
        options: {
            width: 200,
            height: 200,
            left: 0,
            top: 0,
            showHover: false,
            imgType: 'image',
            imgDefaultValue: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=1718395925,3485808025&fm=27&gp=0.jpg',
            borderRadius: '0px',
            backgroundColor: '',
            backgroundImage: '',
            imgWidth: '100px',
            imgHeight: '100px',
            iconName: 'icon-search',
            titleDefaultValue: '主标题',
            descDefaultValue: '副标题',
            fontColor: '#000',
            imgMarginRight: '10px',
            marginLeft: '0px',
            marginRight: '0px',
            padding: '0px',
            linkType: 'inline',
            linkUrl: '',
            query: ''
        }
    },
    {
        type: 'BaseIcon',
        name: '图标',
        icon: 'icon-input',
        options: {
            width: 40,
            height: 40,
            left: 0,
            top: 0,
            iconName: 'icon-search',
            fontColor: '#000',
            fontSize: '12px',
            linkType: 'inline',
            linkUrl: '',
            query: ''
        }
    },
    {
        type: 'BaseButton',
        name: '按钮',
        icon: 'icon-input',
        options: {
            width: 60,
            height: 40,
            left: 0,
            top: 0,
            defaultValue: '确定',
            defaultCName: '确定',
            type: 'primary',
            size: 'small',
            marginLeft: '0px',
            marginRight: '0px',
            linkType: 'inline',
            linkUrl: '',
            query: ''
        }
    },
    {
        type: 'BaseEditor',
        name: '编辑器',
        icon: 'icon-fuwenbenkuang',
        options: {
            width: 200,
            height: 200,
            left: 0,
            top: 0,
            label: '编辑器',
            defaultValue: ''
        }
    },
    {
        type: 'BaseBg',
        name: '卡片背景',
        icon: 'icon-input',
        options: {
            width: 200,
            height: 200,
            left: 0,
            top: 0,
            bgColor1: '#ccc',
            bgColor2: '#666',
            direction: 'bottom',
            opacity: 1,
            borderRadius: 10,
            borderWidth: 0,
            borderStyle: 'solid',
            borderColor: '#ececec'
        }
    },
    {
        type: 'BaseIconZu',
        name: '图标组件',
        icon: 'icon-input',
        options: {
            width: 60,
            height: 60,
            left: 0,
            top: 0,
            iconName: 'icon-gongzuo',
            fontColor: '#000',
            fontSize: '16px',
            linkType: 'inline',
            opacity: 1,
            linkUrl: '',
            query: '',
            backgroundColor: 'red',
            borderRadius: 10,
            borderWidth: 0,
            borderStyle: 'solid',
            borderColor: '#ececec'

        }
    },
    {
        type: 'BaseBox',
        name: '容器组件',
        icon: 'icon-input',
        options: {
            width: 780,
            height: 460,
            left: 0,
            top: 0,
            bgColor1: '',
            bgColor2: '',
            direction: 'bottom',
            opacity: 1,
            borderRadius: 10,
            borderWidth: 1,
            borderStyle: 'solid',
            borderColor: '#ececec',
            shadowColor: '#ccc',
            shadowSize: 10
        }
    },
]

export const mobanComponents = [
    {
        type: 'ninecard',
        name: '九宫格',
        icon: 'icon-input',
        options: {
            width: 200,
            height: 200,
            left: 0,
            top: 0,
            defaultValue: '',
            imgDefaultValue: 'https://avatars2.githubusercontent.com/u/12621342?v=4',
            titleDefaultValue: '123',
            linkDefaultValue: '',
            backgroundColor: '#fff',
            borderRadius: '0px',
            textAlign: 'center',
            fontColor: '#000',
            fontSize: '12px',
            fontWeight: 600,
            marginLeft: '0px',
            marginRight: '0px',
            titleHeight: '',
            lineHeight: '',
            inline: false
        }
    },
    {
        type: 'simpleCard',
        name: '波浪渐变卡片',
        icon: 'icon-input',
        options: {
            width: 200,
            height: 200,
            left: 0,
            top: 0,
            defaultValue: '参与考核的人数',
            defaultValueCName: '参与考核的人数',
            titleDefaultValue: '11',
            titleDefaultValueCName: '11',
            titleFontSize: '48px',
            fontColor: '#000',
            fontSize: '16px',
            color1: '#9CECFB',
            color2: '#65C7F7',
            direction: 'right'
        }
    },
    {
        type: 'progressCard',
        name: '进度卡片',
        icon: 'icon-input',
        options: {
            width: 200,
            height: 200,
            left: 0,
            top: 0,
            color1: '#9CECFB',
            color2: '#65C7F7',
            direction: 'left',
            defaultValue: '啊啊啊啊是',
            defaultValueCName: '啊啊啊啊是',
            titleDefaultValue: '100位客户的能力',
            titleDefaultValueCName: '100位客户的能力',
            titleDescDefaultValue: 'aaa',
            titleDescDefaultValueCName: 'aaa',
            progressTitleDefaultValue: '进度条',
            progressTitleDefaultValueCName: '进度条',
            nameDefaultValue: 'zhangsan',
            nameDefaultValueCName: 'zhangsan',
            descDefaultValue: '100位客户的能力',
            descDefaultValueCName: '100位客户的能力',
            avatarDefaultValue: 'https://dss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2281189818,1836808766&fm=26&gp=0.jpg',
            progressNum: 0,
            progressNumCName: 0,
            titleFontSize: '28px',
            fontColor: '#000',
            fontSize: '16px'
        }
    },
    {
        type: 'avatarCard',
        name: '头像卡片',
        icon: 'icon-input',
        options: {
            width: 200,
            height: 200,
            left: 0,
            top: 0,
            titleDefaultValue: 'zehua Zhang',
            titleDefaultValueCName: 'zehua Zhang',
            avatarDefaultValue: 'https://dss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2281189818,1836808766&fm=26&gp=0.jpg',
            item1NumDefaultValue: '678',
            item1NumDefaultValueCName: '678',
            item1DescDefaultValue: 'AAA',
            item1DescDefaultValueCName: 'AAA',
            item2NumDefaultValue: '457',
            item2NumDefaultValueCName: '457',
            item2DescDefaultValue: 'Amount',
            item2DescDefaultValueCName: 'Amount',
            item3NumDefaultValue: '345',
            item3NumDefaultValueCName: '345',
            item3DescDefaultValue: 'Point',
            item3DescDefaultValueCName: 'Point',
            linkDefaultValue: '11',
            linkDefaultValueCName: '11',
            fontColor: '#FFF',
            titleFontSize: '28px',
            fontSize: '16px',
            linkfontSize: '16px',
            linkValue: '',
            linkType: 'inline',
            linkColor: '#000',
            color1: '#F56C25',
            color2: '#F88B33',
            direction: 'bottom'
        }
    },
    {
        type: 'BaseCard',
        name: '数据卡片',
        icon: 'icon-input',
        options: {
            width: 200,
            height: 200,
            left: 0,
            top: 0,
            topLeftValue: { code: '', name: 'Light Blue' },
            topRightValue: { code: '', name: 'Daily' },
            centerLeftValue: { code: '', name: '1468' },
            centerLeftPer: { code: '', name: '-4.1%' },
            iconName: 'icon-tubiao',
            bottomValue: [
                {
                    num: { code: '', name: 268 },
                    text: { code: '', name: 'adreess' },
                    up: true
                },
                {
                    num: { code: '', name: '4.8%' },
                    text: { code: '', name: 'adrddess' },
                    up: false
                },
                {
                    num: { code: '', name: 699 },
                    text: { code: '', name: 'adrccess' },
                    up: false
                }
            ]
        }
    },
    {
        type: 'BaseImgUpload',
        name: '图片上传',
        icon: 'icon-tupian',
        options: {
            label: '图片上传',
            width: 200,
            height: 200,
            left: 0,
            top: 0,
            defaultValue: [],
            size: {
                width: 100,
                height: 100
            },
            tokenFunc: 'funcGetToken',
            token: '',
            domain: 'http://pfp81ptt6.bkt.clouddn.com/',
            disabled: false,
            length: 8,
            multiple: true
        }
    }    
]

export const echartsComponents = [
    {
        type: 'SearchHead',
        name: '搜索组件',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 1200,
            height: 60,
            top: 0,
            left: 0,
            backgroundColor: '#fff',
            searchInput: '',
            searchForm: []
        }
    },
    {
        type: 'LineEchart',
        name: '折线图',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 768,
            height: 432,
            left: 0,
            top: 0,
            backgroundColor: '#fff',
            tooltip: {
                trigger: 'axis'
            },
            title: {
                text: '纳税趋势',
                textStyle: {
                    fontSize: 14
                }
            },
            legend: {
                data: ['新增户数', '注销户数'],
                textStyle: {
                    fontSize: 14,
                    color: '#666'
                },
                left: 'center'
            },
            grid: {
                top: '15%',
                left: '4%',
                right: '4%',
                bottom: '12%',
                width: '90%',
                height: '80%',
                containLabel: true
            },
            xAxis: {
                type: 'category',
                boundaryGap: false,
                data: ['2012年','2013年','2014年','2015年','2016年','2017年','2018年'],
                axisLabel: {
                    textStyle: {
                        color: '#666'
                    }
                }
            },
            yAxis: {
                name: '户数',
                type: 'value',
                axisLabel: {
                    formatter: '{value}',
                    textStyle: {
                        color: '#666'
                    }
                },
                splitLine: {
                    lineStyle: {
                        color: '#f1f1f1'
                    }
                },
                axisLine: {
                    lineStyle: {
                        color: '#666'
                    }
                }
            },
            series: [
                {
                    name: '新增户数',
                    type: 'line',
                    color: '#86D560',
                    smooth: true,
                    areaStyle: {
                        normal: {
                            color: '#86D560',
                            opacity: 0.1
                        }
                    },
                    symbol: 'circle',
                    symbolSize: 5,
                    data: [451, 352, 303, 534, 95, 236, 217, 328, 159, 151, 231, 192, 453, 524, 165, 236, 527, 328, 129, 530]
                },
                {
                    name: '注销户数',
                    type: 'line',
                    color: '#009DFF',
                    smooth: true,
                    areaStyle: {
                        normal: {
                            color: '#009DFF',
                            opacity: 0.1
                        }
                    },
                    symbol: 'circle',
                    symbolSize: 5,
                    data: [360, 545, 80, 192, 330, 580, 192, 80, 250, 453, 352, 28, 625, 345, 65, 325, 468, 108, 253, 98]
                }
            ]
        }
    },
    {
        type: 'BarEchart',
        name: '柱状图',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 768,
            height: 432,
            left: 0,
            top: 0,
            backgroundColor: '#fff',
            liandong: [],
            liandongArr: [],
            grid: {
                height: '80%',
                bottom: 60,
                top: 40,
                width: '80%'
            },
            title: {
                text: '销量增长趋势',
                textStyle: {
                    fontSize: 14
                }
            },
            legend: {
                show: true,
                orient: 'horizontal',
                top: 15,
                left: 'center',
            },
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'shadow'
                }
            },
            xAxis: {
                type: 'category',
                axisLabel: {
                    show: true,
                    interval:0, 
                    color: '#333', 
                },
                axisLine: {
                    show: true,
                    lineStyle: {
                        color: '#e7e7e7'
                    }
                },
                splitLine: {
                    show: false,
                },
                axisTick: {
                    show: true,
                    lineStyle: {
                        color: '#e7e7e7'
                    }
                },
                data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
            },
            yAxis: {
                type: 'value',
                axisLabel: {
                    show: true,
                    color: '#333'
                },
                splitLine: {
                    show: true,
                    lineStyle: {
                        type: 'dashed'
                    }
                },
                axisLine: {
                    show: true,
                    lineStyle: {
                        color: '#ccc'
                    }
                },
                axisTick: {
                    show: true,
                    lineStyle: {
                        color: '#ccc'
                    }
                }
            },
            series: [{
                data: [5, 20, 36, 10, 10, 20],
                name: '销量',
                type: 'bar',
                label: {
                    show: true,
                    position: 'top',
                    textStyle: {
                        color: '#555'
                    }
                },
                itemStyle: {
                    color: '#05C3FA',
                    barBorderRadius: [5, 5, 0, 0]
                },
                barWidth: ''
            }]
        }
    },
    {
        type: 'LineBarEchart',
        name: '线柱图',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 768,
            height: 432,
            left: 0,
            top: 0,
            backgroundColor: '#fff',
            liandong: [],
            liandongArr: [],
            tooltip: {
                trigger: 'axis'
            },
            title: {
                text: '销量增长趋势',
                textStyle: {
                    fontSize: 14
                }
            },
            legend: {
                data: ['新增户数', '注销户数'],
                textStyle: {
                    fontSize: 14,
                    color: '#666'
                },
                left: 'center'
            },
            grid: {
                top: '15%',
                left: '4%',
                right: '4%',
                bottom: '12%',
                width: '90%',
                height: '80%',
            },
            xAxis: {
                type: 'category',
                data: ['2012年','2013年','2014年','2015年','2016年','2017年','2018年'],
                axisLabel: {
                    textStyle: {
                        color: '#666'
                    }
                }
            },
            yAxis: {
                name: '户数',
                type: 'value',
                axisLabel: {
                    formatter: '{value}',
                    textStyle: {
                        color: '#666'
                    }
                },
                splitLine: {
                    lineStyle: {
                        color: '#f1f1f1'
                    }
                },
                axisLine: {
                    lineStyle: {
                        color: '#666'
                    }
                }
            },
            series: [
                {
                    name: '注销户数',
                    type: 'bar',
                    label: {
                        show: true,
                        position: 'top',
                        textStyle: {
                            color: '#555'
                        }
                    },
                    itemStyle: {
                        color: '#05C3FA',
                        barBorderRadius: [5, 5, 0, 0]
                    },
                    barWidth: '',
                    data: [451, 352, 303, 534, 95, 236, 217, 328, 159, 151, 231, 192, 453, 524, 165, 236, 527, 328, 129]
                },
                {
                    name: '新增户数',
                    type: 'line',
                    itemStyle: {
                        color: '#AF89D6',
                    },
                    smooth: true,
                    symbol: 'circle',
                    symbolSize: 8,
                    data: [431, 332, 203, 514, 195, 136, 207, 308, 109, 101, 201, 102, 403, 504, 105, 206, 507, 308, 109]
                }
            ]
        }
    },
    {
        type: 'PieEchart',
        name: '饼图',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 768,
            height: 432,
            top: 0,
            left: 0,
            liandong: [],
            liandongArr: [],
            backgroundColor: '#fff',
            title: {
                text: '注册资金',
                x: 'center',
                y: 'center',
                textStyle: {
                    fontSize: 14
                }
            },
            tooltip: {
                show: true,
                trigger: 'item',
                formatter: "{b}: {c} ({d}%)"
            },
            legend: {
                orient: 'horizontal',
                top: 15,
                left: 'center',
                data: ['<10w', '10w-50w', '50w-100w']
            },
            series: [{
                type: 'pie',
                roseType: '',
                selectedMode: 'single',
                radius: ['25%', '58%','80%'],
                color: ['#86D560', '#AF89D6', '#59ADF3', '#009DFF','#FF7D18'],
                label: {
                    normal: {
                        position: 'inner',
                        formatter: '{d}%',

                        textStyle: {
                            color: '#fff',
                            fontWeight: 'bold',
                            fontSize: 14
                        }
                    }
                },
                labelLine: {
                    normal: {
                        show: false
                    }
                },
                data: [{value: 3661,name: '<10w'}, {value: 5713, name: '10w-50w'}, {value: 9938,name: '50w-100w'}]
            }]
        }
    },
    {
        type: 'KuaiPieEchart',
        name: '饼图-区块',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 768,
            height: 432,
            top: 0,
            left: 0,
            backgroundColor: '#fff',
            liandong: [],
            liandongArr: [],
            title: {
                text: '饼图-区块',
                textStyle: {
                    fontSize: 14,
                    
                },
                left: 'center',
                    top: 'center'
            },
        }
    },
    {
        type: 'GaugeEchart',
        name: '仪表盘',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 768,
            height: 432,
            top: 0,
            left: 0,
            backgroundColor: '#fff',
            liandong: [],
            liandongArr: [],
            title: {
                text: '仪表盘',
                textStyle: {
                    fontSize: 14
                }
            },
            series: [
                {
                    type: 'gauge',
                    pointer:{
                      show:false  
                    },
                    radius: '70%',
                    startAngle: 200,
                    endAngle: -20,
                    splitNumber: 4,
                    axisLine: { // 坐标轴线
                        lineStyle: { // 属性lineStyle控制线条样式
                            color: [
                                [1, '#bfcbd9']
                            ],
                            width: 20
                        }
        
                    },
                    splitLine: { //分隔线样式
                        show: true,
                    },
                    axisLabel: { //刻度标签
                        show: false,
                    },
                    axisTick: { //刻度样式
                        show: true,
                    },
                    detail: {
                        fontSize:14,
                        offsetCenter:[0, '20%']
                    },
                    data: [{
                        value: 30,
                        name: ''
                    }]
                }, {
                    type: 'gauge',
                    title : {
                        fontSize: 14,
                        color: '#666',
                        offsetCenter: [0, '40%'],
                    },
                    pointer:{
                      show:true  
                    },
                    radius: '70%',
                    startAngle: 200,
                    endAngle: 50,
                    splitNumber: 4,
                    axisLine: { // 坐标轴线
                        lineStyle: { 
                            color: [
                                [1, '#009DFF']
                            ],
                            width: 18,
                            shadowOffsetX: 0,
                            shadowOffsetY: 0,
                            opacity: 1,
                        }
        
                    },
                    splitLine: { //分隔线样式
                        show: true,
                    },
                    axisLabel: { //刻度标签
                        show: true,
                    },
                    axisTick: { //刻度样式
                        show: true,
                    },
                    detail: {
                        fontSize:14,
                        offsetCenter:[0, '20%']
                    },
                    data: [{
                        value: '30',
                        name: 'km/h'
                    }]
                }
        
            ]
        }
        
    },
    {
        type: 'CircleProgressEchart',
        name: '环形进度',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 200,
            height: 200,
            left: 0,
            top: 0,
            backgroundColor: '#fff',
            title: '环形进度',
            customColor: '#009DFF',
            percentage: 80,
            strokeWidth: 12
        }
    },
    {
        type: 'HxprogressEchart',
        name: '横向进度',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 768,
            height: 60,
            left: 0,
            top: 0,
            backgroundColor: '#fff',
            title: '横向进度',
            customColor: '#009DFF',
            percentage: 80,
            strokeWidth: 12
        }
    },
    {
        type: 'MoreCircleEchart',
        name: '多环形图',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 768,
            height: 432,
            left: 0,
            top: 0,
            backgroundColor:'#fff',
            title: {
                text: '多环形图',
                textStyle: {
                    fontSize: 14
                }
            },
            legend: {
                show: true,
                orient: 'horizontal',
                top: 15,
                left: 'center',
                data: [],
                itemWidth: 30,
                itemHeight: 20,
                padding: [0, 5],
                itemGap: 25,
                formatter: function(name) {
                    return ""
                },
                textStyle: {
                    rich: {
                        title: {
                            fontSize: 10,
                            lineHeight: 10,
                            color: "rgba(0,0,0,.45)"
                        },
                        value: {
                            fontSize: 14,
                            lineHeight: 18,
                            color: "rgba(0,0,0,.85)"
                        }
                    }
                },
            },
            tooltip: {
                show: true,
                trigger: "item",
                formatter: "{a}<br>{b}:{c}({d}%)"
            },
            color:  ['#86D560', '#AF89D6', '#59ADF3', '#009DFF','#FF7D18'],
            grid: {
                top: '13%',
                bottom: '40%',
                left: "50%",
                height: '30%',
                containLabel: false
            },
            yAxis: [{
                type: 'category',
                inverse: true,
                axisLine: {
                    show: false
                },
                axisTick: {
                    show: false
                },
                axisLabel: {
                    interval: 0,
                    inside: true,
                    textStyle: {
                        color: "#000",
                        fontSize: 14,
                    },
                    show: true
                },
                data: []
            }],
            xAxis: [{
                show: false
            }],
            series: []
        }
    },
    {
        type: 'GraphEchart',
        name: '关系图',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 768,
            height: 432,
            top: 0,
            left: 0,
            backgroundColor: '#fff',
            title: {
                text: '知识图谱',
                textStyle: {
                    fontSize: 14
                }
            },
        }
    },
    {
        type: 'CircleEchart',
        name: '圈图',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 768,
            height: 432,
            top: 0,
            left: 0,
            backgroundColor: '#fff',
            title: {
                text: '公司开票数据',
                textStyle: {
                    fontSize: 14
                }
            },
        }
    },
    {
        type: 'FunnelEchart',
        name: '漏斗图',
        icon: '',
        options: {
            sourceId:'',
            width: 768,
            height: 432,
            left: 0,
            top: 0,
            backgroundColor: '#fff',
            title: {
                text: '漏斗图',
                textStyle: {
                    fontSize: 14
                }
            },
            tooltip: {
                trigger: 'item',
                formatter: "{b} : {d}%"
            },
            legend: {
                show: true,
                orient: 'horizontal',
                top: 15,
                left: 'center',
                data: ['展现','点击','访问','咨询','订单']
            },
            color: ['#86D560', '#AF89D6', '#59ADF3', '#009DFF','#FF7D18'],
            series: [
                {
                    name:'漏斗图',
                    type:'funnel',
                    left: '5%',
                    top: 50,
                    width: '90%',
                    height: '90%',
                    min: 0,
                    max: 100,
                    minSize: '0%',
                    maxSize: '100%',
                    sort: 'descending',
                    gap: 2,
                    label: {
                        show: true,
                        position: 'inside',
                        formatter: "{b}:{c}"
                    },
                    labelLine: {
                        length: 10,
                        lineStyle: {
                            width: 1,
                            type: 'solid'
                        }
                    },
                    itemStyle: {
                        borderColor: '#fff',
                        borderWidth: 1
                    },
                    emphasis: {
                        label: {
                            fontSize: 20
                        }
                    },
                    data: [
                        {value: 60, name: '访问'},
                        {value: 40, name: '咨询'},
                        {value: 20, name: '订单'},
                        {value: 80, name: '点击'},
                        {value: 100, name: '展现'}
                    ]
                }
            ]
        }
    },
    {
        type: 'RadarEchart',
        name: '雷达图',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 768,
            height: 432,
            left: 0,
            top: 0,
            backgroundColor: '#fff',
            title: {
                text: '雷达图',
                textStyle: {
                    fontSize: 14
                }
            },
            tooltip: {},
            legend: {
                show: true,
                orient: 'horizontal',
                left: 'center',
                top: 15,
                itemWidth: 12,
                itemHeight: 12,
                data: ['预算分配', '实际开销'],
                textStyle: {
                    color: '#333'
                }
            },
            radar: {
                radius: '70%',
                splitNumber: 8,
                axisLine: {
                    lineStyle: {
                        color: '#f1f1f1',
                        opacity: .2
                    }
                },
                name: {
                    color: '#666'
                },
                splitLine: {
                    lineStyle: {
                        color: '#f1f1f1',
                        opacity: .2
                    }
                },
                splitArea: {
                    areaStyle: {
                        color: 'rgba(127,95,132,.6)',
                        opacity: 1,
                    }
                },
                indicator: [{
                    name: 'Sales',
                    max: 6000
                }, {
                    name: 'Administration',
                    max: 16000
                }, {
                    name: 'Information Techology',
                    max: 30000
                }, {
                    name: 'Customer Support',
                    max: 35000
                }, {
                    name: 'Development',
                    max: 50000
                }, {
                    name: 'Marketing',
                    max: 25000
                }]
            },
            series: [{
                name: '预算 vs 开销',
                type: 'radar',
                symbolSize: 0,
                color:  ['#86D560', '#AF89D6', '#59ADF3', '#009DFF','#FF7D18'],
                areaStyle: {
                    normal: {
                        shadowColor: 'rgba(0,0,0,.2)',
                        shadowOffsetX: 0,
                        shadowOffsetY: 10,
                        opacity: 1
                    }
                },
                data: [{
                    value: [5000, 7000, 12000, 11000, 15000, 14000],
                    name: '预算分配',
                }, {
                    value: [2500, 12000, 8000, 8500, 12000, 12000],
                    name: '实际开销',
                }]
            }],
           
        }
    },
    {
        type: 'WordCloudEchart',
        name: '词云图',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 768,
            height: 432,
            left: 0,
            top: 0,
            backgroundColor: '#fff',
            tooltip: {
                show: true
            },
            title: {
                text: '字符云',
                textStyle: {
                    fontSize: 14
                }
            },
            series: [{
                name: '词云',
                type: "wordCloud",
                gridSize:20,
                shape:'diamond',
                sizeRange: [12, 50],
                width:'100%',
                height:'100%',
                textStyle: {
                    normal: {
                        color: function() {
                            return 'rgb(' + [
                                Math.round(Math.random() * 160),
                                Math.round(Math.random() * 160),
                                Math.round(Math.random() * 160)
                            ].join(',') + ')';
                        }
                    },
                    emphasis: {
                        shadowBlur: 10,
                        shadowColor: '#333'
                    }
                },
                data: [{
                        name: " 没有",
                        value: 30,
                    },
                    {
                        name: " 糊弄人",
                        value: 2
                    },
                    {
                        name: " note7",
                        value: 2
                    },
        
                    {
                        name: " 心情",
                        value: 2
                    },
                    {
                        name: " 另外",
                        value: 2
                    },
                    {
                        name: " 游戏",
                        value: 2
                    },
                    {
                        name: " 公司",
                        value: 2
                    },
                    {
                        name: " 按键",
                        value: 2
                    },
                    {
                        name: " 这次",
                        value: 2
                    },
                    {
                        name: " 性能",
                        value: 2
                    }
                ],
            }]
        }
    },
    {
        type: 'SunburstEchart',
        name: '旭日图',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 768,
            height: 432,
            left: 0,
            top: 0,
            backgroundColor: '#fff',
            title: {
                text: '旭日图',
                textStyle: {
                    fontSize: 14,
                },
            },
            series: {
                type: 'sunburst',
                highlightPolicy: 'ancestor',
                data: [],
                radius: [0, '95%'],
                sort: null,
                levels: [{}, {
                    r0: '15%',
                    r: '35%',
                    itemStyle: {
                        borderWidth: 2
                    },
                    label: {
                        rotate: 'tangential'
                    }
                }, {
                    r0: '35%',
                    r: '70%',
                    label: {
                        align: 'right'
                    }
                }, {
                    r0: '70%',
                    r: '72%',
                    label: {
                        position: 'outside',
                        padding: 3,
                        silent: false
                    },
                    itemStyle: {
                        borderWidth: 3
                    }
                }]
            }
        }
    },
    {
        type: 'TreeEchart',
        name: '机构图',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 768,
            height: 432,
            left: 0,
            top: 0,
            backgroundColor: '#fff',
            title: {
                text: '机构图',
                textStyle: {
                    fontSize: 14,
                },
            },
            tooltip: {
                trigger: 'item',
                triggerOn: 'mousemove'
            },
    
            series:[
                {
                    type: 'tree',                 
                    layout: 'orthogonal',
                    data: [],
                    roam: true,
                    left: '20',
                    right: '10',
                    top: '20',
                    bottom: '20',
                    width: '85%',
                    height: '85%',
                    symbol: 'circle',
                    symbolSize: 8,
                    orient: 'TB',
                    expandAndCollapse: true,
                    label: {
                        position: 'bottom',
                        rotate: 0,
                        verticalAlign: 'middle',
                        align: 'right'
                    },
                    leaves: {
                        label: {
                            position: 'top',
                            rotate: 0,
                            verticalAlign: 'middle',
                            align: 'left'
                        }
                    },
                    animationDurationUpdate: 750
                }
            ]
        }
    },
    {
        type: 'SankeyEchart',
        name: '桑基图',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 768,
            height: 432,
            left: 0,
            top: 0,
            backgroundColor: '#fff',
            title: {
                text: '桑基图',
                textStyle: {
                    fontSize: 14,
                },
            },
            tooltip : {
                trigger: 'item',
                formatter: "{b} :{c}"
            },
            series: {
                type: 'sankey',
                layout:'none',
                top: 20,
                width: '90%',
                height: '90%',
                color: ['#86D560', '#AF89D6', '#59ADF3', '#009DFF','#FF7D18'],
                lineStyle: {
                    normal: {
                        color: 'source'
                    }
                },
                data: [{
                    name: '商户D'
                }, {
                    name: '商户C'
                }, {
                    name: '商户A'
                }, {
                    name: '商户B'
                }, {
                    name: '商户G'
                },  {
                    name: '商户H'
                }],
                links: [
                    {
                    source: '商户D',
                    target: '商户B',
                    value: 12
                }, {
                    source: '商户C',
                    target: '商户A',
                    value: 5
                }, {
                    source: '商户B',
                    target: '商户A',
                    value: 1
                }, {
                    source: '商户G',
                    target: '商户A',
                    value: 1
                },{
                    source: '商户H',
                    target: '商户A',
                    value: 2
                }]
            }
        }
    },
    {
        type: 'TimeLineEchart',
        name: '时间轴',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 1200,
            height: 80,
            top: 0,
            left: 0,
            backgroundColor: '#fff',
            liandong: [],
            liandongArr: [],
            timeline: {
                data: ["2016", "2017", "2018", "2019", "2020"],
                axisType: 'category',
                show: true,
                autoPlay: true,
                playInterval: 3000,
                left: '10%',
                right: '10%',
                bottom: '20',
                width: '80%',
                label: {
                    normal: {
                        textStyle: {
                            color: '#666'
                        }
                    },
                    emphasis: {
                        textStyle: {
                            color: '#666'
                        }
                    }
                },
                symbolSize: 10,
                lineStyle: {
                    color: '#555'
                },
                checkpointStyle: {
                    borderColor: '#777',
                    borderWidth: 2
                },
                controlStyle: {
                    showNextBtn: true,
                    showPrevBtn: true,
                    normal: {
                        color: '#666',
                        borderColor: '#666'
                    },
                    emphasis: {
                        color: '#aaa',
                        borderColor: '#aaa'
                    }
                },
        
            }
        }
    },
]
export const echartsMapComponents = [
    {
        type: 'QianxiMapEchart',
        name: '迁徙图',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 1200,
            height: 675,
            left: 0,
            top: 0,
            backgroundColor: '#fff',
            title: {
                text: '模拟迁徙图',
                left: 'center',
                textStyle: {
                    color: '#fff'
                }
            },
            tooltip: {
                trigger: 'item',
                formatter: function(params) {
                    if (params.seriesIndex == 2 || params.seriesIndex == 5 || params.seriesIndex == 8) {
                        return params.name + params.seriesName + ':' + params.data.value[2] + ' 人次';
                    } else if (params.seriesIndex == 1 || params.seriesIndex == 4 || params.seriesIndex == 7) {
                        return params.data.fromName + '→' + params.data.toName;
                    }
                }
            },
            legend: {
                orient: 'vertical',
                bottom: '2%',
                right: '2%',
                data: [],
                textStyle: {
                    color: '#fff'
                },
                selectedMode: 'single',
            },
            geo: {
                show: true,
                map: 'china',
                roam: true,
                zoom: 1,
                center: [113.83531246, 34.0267395887],
                label: {
                    emphasis: {
                        show: false
                    }
                },
                itemStyle: {
                    normal: {
                        borderColor: '#404a59',
                        borderWidth: 1,
                        areaColor: '#323c48',
                    },
                    emphasis: {
                        areaColor: '#2a333d',
                        borderWidth: 0
                    }
                }
            },
            
            series: [
                { //线
                    name: '',
                    type: 'lines',
                    zlevel: 1,
                    effect: {
                        show: true,
                        period: 6,
                        trailLength: 0.7,
                        color: '#fff',
                        symbolSize: 3
                    },
                    lineStyle: {
                        normal: {
                            color: '#a6c84c',
                            width: 0,
                            curveness: 0.2
                        }
                    },
                    data: []
                }, { //移动 点
                    name: '',
                    type: 'lines',
                    zlevel: 2,
                    effect: {
                        show: true,
                        period: 6,
                        trailLength: 0,
                        symbol: 'pin',
                        symbolSize: 12
                    },
                    lineStyle: {
                        normal: {
                            color: '#1DE9B6',
                            width: 1,
                            opacity: 0.4,
                            curveness: 0.2
                        }
                    },
                    data: []
                }, { //省份圆点
                    name: '',
                    type: 'effectScatter',
                    coordinateSystem: 'geo',
                    zlevel: 2,
                    rippleEffect: {
                        brushType: 'stroke'
                    },
                    label: {
                        normal: {
                            show: true,
                            position: 'right',
                            formatter: '{b}'
                        }
                    },
                    symbolSize: function(val) {
                        return val[2] / 6;
                    },
                    itemStyle: {
                        normal: {
                            color: function(params) {
                                var tmp = params.data.value[2]
                                if (tmp < 100) {
                                    return 'green';
                                } else if (tmp > 150) {
                                    return 'red'
                                } else
                                    return 'yellow';
                            }
                        }
                    },
                    data: []
                }
            ]
        }
    },
    {
        type: 'PaimingMapEchart',
        name: '排名图',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 1200,
            height: 675,
            left: 0,
            top: 0,
            backgroundColor: '#fff',
        }
    },
    {
        type: 'DianMapEchart',
        name: '提示图',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 1200,
            height: 675,
            left: 0,
            top: 0,
            backgroundColor: '#fff',
            title: {
                text: '地图',
                left: 'center',
                textStyle: {
                    color: '#fff'
                }
            },
        }
    },
    {
        type: 'XiazuanMapEchart',
        name: '下钻地图',
        icon: 'icon-input',
        options: {
            sourceId:'',
            width: 1200,
            height: 675,
            left: 0,
            top: 0,
            backgroundColor: '#fff',
            title: {
                text: '下钻地图',
                left: 'center',
                textStyle: {
                    color: '#fff'
                }
            },
        }
    }
]